﻿<phone:PhoneApplicationPage 
    x:Class="Coding4Fun.Phone.TestApplication.Samples.Slider"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:c4f="clr-namespace:Coding4Fun.Phone.Controls;assembly=Coding4Fun.Phone.Controls" 
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
    shell:SystemTray.IsVisible="True">

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock x:Name="ApplicationTitle" Text="SAMPLES" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock x:Name="PageTitle" Text="super slider" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <StackPanel>
                <TextBlock 
                    Text="Base Slider" 
                    Style="{StaticResource PhoneTextTitle2Style}" />
                <c4f:SuperSlider 
                    Name="ResultSlider"
                    Height="24"
                    Value="2"
                    ValueChanged="ResultSlider_ValueChanged"/>
                <StackPanel>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Margin="12, 0">Via Binding:</TextBlock>
                        <TextBlock Text="{Binding ElementName=ResultSlider, Path=Value}" />
                    </StackPanel>

                    <StackPanel Orientation="Horizontal">
                        <TextBlock Margin="12, 0">Via Event:</TextBlock>
                        <TextBlock Name="SliderResult" />
                    </StackPanel>
                </StackPanel>
                
                <TextBlock 
                    Margin="12, 24, 0, 0"
                    Text="Exta Bits" 
                    Style="{StaticResource PhoneTextTitle2Style}"/>

                <TextBlock>Slider with steps</TextBlock>
                <c4f:SuperSlider 
                    Height="24"
                    Value="10"
                    Step="1"
                    Minimum="5"
                    Maximum="15" />
                <TextBlock>Slider with thumb</TextBlock>
                <c4f:SuperSlider 
                    Margin="0, 12"
                    Height="24"
                    Fill="Orange"
                    Background="CornflowerBlue">
                    <c4f:SuperSlider.Thumb>
                        <Rectangle 
                            Fill="Red"
                            Height="12"
                            />
                    </c4f:SuperSlider.Thumb>
                </c4f:SuperSlider>
                <TextBlock>Slider with custom sizing and "flair"</TextBlock>
                <c4f:SuperSlider 
                    Margin="0, 12"
                    BackgroundSize="12"
                    ProgressSize="24"
                    Background="CornflowerBlue">
                    <c4f:SuperSlider.Fill>
                        <LinearGradientBrush EndPoint="1,0">
                            <GradientStop Offset="0.00" Color="#ffff0000"/>
                            <GradientStop Offset="0.166666" Color="#ffffff00"/>
                            <GradientStop Offset="0.333333" Color="#ff00ff00"/>
                            <GradientStop Offset="0.50" Color="#ff00ffff"/>
                            <GradientStop Offset="0.666666" Color="#ff0000ff"/>
                            <GradientStop Offset="0.833333" Color="#ffff00ff"/>
                            <GradientStop Offset="1.00" Color="#ffff0000"/>
                        </LinearGradientBrush>
                    </c4f:SuperSlider.Fill>
                    <c4f:SuperSlider.Thumb>
                        <Grid Width="24">
                            <Rectangle 
				                Stroke="Black"
                                StrokeThickness="6" />
                            <Rectangle 
				                Stroke="White"
                                StrokeThickness="3" />
                        </Grid>
                    </c4f:SuperSlider.Thumb>
                </c4f:SuperSlider>
                <TextBlock 
                    Margin="12, 24, 0, 0"
                    Style="{StaticResource PhoneTextTitle2Style}">Vertical Examples</TextBlock>
            </StackPanel>
            <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center">
                <c4f:SuperSlider 
                    Step="1"
                    Margin="12, 0"
                    Width="24"
                    Value="10"
                    Minimum="5"
                    Maximum="15"
                    Orientation="Vertical"/>
                <c4f:SuperSlider 
                    Margin="12, 0"
                    Width="24"
                    Fill="Orange"
                    Background="CornflowerBlue"
                     Orientation="Vertical">
                    <c4f:SuperSlider.Thumb>
                        <Rectangle 
                            Fill="Red"
                            Height="12"
                            />
                    </c4f:SuperSlider.Thumb>
                </c4f:SuperSlider>

                <c4f:SuperSlider 
                    Margin="12, 0"
                    BackgroundSize="12"
                    ProgressSize="24"
                    Fill="Orange"
                    Background="CornflowerBlue"
                     Orientation="Vertical">
                    <c4f:SuperSlider.Thumb>
                        <Grid Height="24">
                            <Rectangle 
				                Stroke="Black"
                                StrokeThickness="6" />
                            <Rectangle 
				                Stroke="White"
                                StrokeThickness="3" />
                        </Grid>
                    </c4f:SuperSlider.Thumb>
                </c4f:SuperSlider>
            </StackPanel>
            
        </Grid>
    </Grid>
 
    <!--Sample code showing usage of ApplicationBar-->
    <!--<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>-->

</phone:PhoneApplicationPage>
